<template>
  <div class="bbzc-filter saixuan">
    <!-- 人才 -->

    <template v-if="show">
      <!-- <div class="li">
        <p class="p1">距离</p>
        <p
          class="p2"
          @click="goClick(-1, 'distance')"
          :class="isXuan(-1, 'distance') ? 'xuan' : ''"
        >
          不限
        </p>
        <div class="list">
          <el-select v-model="fullData.distance" placeholder="请选择" clearable>
            <el-option
              v-for="item in distanceList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </div>
      </div> -->
      <div class="li">
        <p class="p1">行业分类</p>
        <p class="p2" @click="goClickn(-1, 1)" :class="industryTypeIndex == -1 ? 'xuan' : ''">
          不限
        </p>
        <div class="list">
          <div v-for="(item, index) in industryTypeList" :key="index" :ref="'brandChar' + index"
            @click="goClickn(item, 1, 'brandChar' + index)" :class="industryTypeIndex == item.lableName ? 'xuan' : ''">
            {{ item.lableName }}
          </div>
        </div>
      </div>
      <div class="brandPop2" v-if="brandloading">
        <div class="brandPop_item2" :class="isXuan2(i) ? 'xuan' : ''" v-for="i in curIndustryTypeList" :key="i.id"
          @click="goClickn(i, 2)">
          <span class="brandPop_item_span2">{{ i.lableName }}</span>
        </div>
        <div class="trangle" :style="'left:' + trangleLeft + 'px'"></div>
      </div>
      <div class="li" v-if="curIndustryTypeCList.length > 0">
        <p class="p1">职位分类</p>

        <p class="p2" @click="goClickn(-1, 3)" :class="isXuan3(-1) ? 'xuan' : ''">
          不限
        </p>
        <div class="list divs">
          <div class="divs" v-for="(item, index) in curIndustryTypeCList" :key="index" @click="goClickn(item, 3)"
            :title="item.lableName" :class="isXuan3(item) ? 'xuan' : ''">
            {{ item.lableName }}
          </div>
        </div>
      </div>
      <div class="li">
        <p class="p1">学历要求</p>
        <p class="p2" @click="goClick(-1, 'highestEducation')" :class="isXuan(-1, 'highestEducation') ? 'xuan' : ''">
          不限
        </p>
        <div class="list">
          <div v-for="(item, index) in highestEducationList" :key="index" @click="goClick(item, 'highestEducation')"
            :class="isXuan(item, 'highestEducation') ? 'xuan' : ''">
            {{ item.valueName }}
          </div>
        </div>
      </div>
      <div class="li">
        <p class="p1">年龄</p>
        <p class="p2" @click="quyuClick2(-1)" :class="!(ageRange1 && ageRange2) ? 'xuan' : ''">
          不限
        </p>
        <div class="list">
          <div class="custom">
            <!-- <span class="custom_title">自定义</span> -->
            <div class="custom_input_wrap">
              <!-- oninput="value=value.replace(/[^\d]/g,'')" -->
              <el-select style="margin-right: 8px" v-model="ageRange1" placeholder="请选择" :clearable="false">
                <el-option v-for="item in ageRangeList1" :key="item.value" :label="item.label" :value="item.value"
                  :disabled="item.disabled">
                </el-option>
              </el-select>
            </div>
            <div class="bq">到</div>
            <div class="custom_input_wrap">
              <el-select v-model="ageRange2" placeholder="请选择" :clearable="false">
                <el-option v-for="item in ageRangeList2" :key="item.value" :label="item.label" :value="item.value"
                  :disabled="item.disabled">
                </el-option>
              </el-select>
            </div>
          </div>
        </div>
      </div>
      <div class="li">
        <p class="p1">工作经验</p>
        <p class="p2" @click="goClick(-1, 'workExperience')" :class="isXuan(-1, 'workExperience') ? 'xuan' : ''">
          不限
        </p>
        <div class="list">
          <div v-for="(item, index) in workExperienceList" :key="index" @click="goClick(item, 'workExperience')"
            :class="isXuan(item, 'workExperience') ? 'xuan' : ''">
            {{ item.valueName }}
          </div>
        </div>
      </div>
      <div class="li">
        <p class="p1">薪资范围</p>
        <p class="p2" @click="quyuClick1(-1)" :class="minimumPrice == '' && highestPrice == '' ? 'xuan' : ''">
          不限
        </p>

        <div class="list">
          <div class="custom">
            <div class="custom_input_wrap custom_input_wrap_price">
              <!-- oninput="value=value.replace(/[^\d]/g,'')" -->
              <input class="custom_input" type="number" oninput="if(value.length>5)value=value.slice(0,5)"
                v-model="minimumPrice" placeholder="最低薪资" />
            </div>
            <div class="bq" style="line-height: 28px">到</div>
            <div class="custom_input_wrap custom_input_wrap_price">
              <input class="custom_input" placeholder="最高薪资" type="number"
                oninput="if(value.length>5)value=value.slice(0,5)" v-model="highestPrice" />
            </div>
            <!-- <div class="bq">万</div>-->
            <div class="custom_qd" @click.stop="confirmnnnn" style="margin-bottom: 0">
              确定
            </div>

            <!-- <div class="custom_input_wrap" style=" margin-right: 12px;">
              <input
                class="custom_input"
                type="number"
                v-model="minimumPrice"
                oninput="if(value.length>5)value=value.slice(0,5)"
                placeholder=""
              />
            </div>
            <div class="bq" style="line-height:28px;">到</div>
            <div class="custom_input_wrap" style=" margin-right: -30px;">
              <input
                class="custom_input"
                placeholder=""
                type="number"
                oninput="if(value.length>5)value=value.slice(0,5)"
                v-model="highestPrice"
              />
            </div> -->
          </div>
        </div>
      </div>
      <div class="li">
        <p class="p1">发布日期</p>
        <p class="p2" @click="goClick(-1, 'releaseDate')" :class="isXuan(-1, 'releaseDate') ? 'xuan' : ''">
          不限
        </p>
        <div class="list">
          <el-select v-model="fullData.releaseDate" placeholder="不限" style="margin-right: 6px" :clearable="false">
            <el-option v-for="item in releaseDateList" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
          天内
        </div>
      </div>
    </template>
    <div class="saixuan">
      <div class="yixuan">
        <div class="na">已选条件：</div>
        <div class="li" v-for="(item, index) in screenList" :key="item.type + index">
          {{ item.value }}
          <img src="@/assets/cha.png" @click="clear(item)" />
        </div>
        <div class="qinchu" @click="clear(-1)">清除全部</div>
      </div>
    </div>
  </div>
</template>

<script>
// 用v-show
export default {
  props: {
    type: { type: String, default: "resume" },
    show: { type: Boolean, default: true },
  },
  data() {
    return {
      xinzi: -1,
      // type: "part",
      leibieIndex: -1,
      quyuIndex: -1,
      priceIndex: -1,
      loucIndex: -1,
      mianjiIndex: -1,

      jiaruXuan: "",
      jiaruXuan1: "",

      industryTypeList: [],
      industryTypeCList: [],
      industryTypeCCList: [],
      parentId: "",

      industryTypeIndex: -1,
      brandloading: false,
      trangleLeft: "10",
      partData2: { industryTypeForm: {} },
      curIndustryTypeList: [],
      curIndustryTypeCList: [],

      distanceList: [],
      highestEducationList: [],
      releaseDateList: [],
      workExperienceList: [],
      intendedPositionList: [],
      industryTypeList: [],
      ageRangeList1: [],
      ageRangeList2: [],
      ageRange1: "",
      ageRange2: "",
      fullData2: { industryTypeForm: {} },
      fullData: {
        intendedPosition: "", //职位类别
        // region: "", //所在区域
        distance: "", //距离
        highestEducation: "", //学历要求
        workExperience: "", //工作经验
        releaseDate: "", //发布日期
        salaryExpectation: "", //薪资范围
        dateBirth: "", //年龄
      },
      positionCategoryList: [], //岗位类型
      regionList: [], //所在区域
      salaryRangeList: [], //薪资范围

      fringeBenefitsList: [], //福利待遇
      educationalRequirementsList: [], //学历要求
      yearsServiceList: [], //工作经验

      recruiterList: [
        { valueName: "只看认证企业", valueNum: 1 },
        { valueName: "只看个人用工", valueNum: 2 },
      ], // 招聘者
      genderRequirementsList: [
        { valueName: "男", valueNum: 1 },
        { valueName: "女", valueNum: 2 },
      ], //性别要求
      startTime: "",
      endTime: "",
      workCycleList: [
        // { valueName: "包住宿", valueNum: 1 },
        // { valueName: "包工作餐", valueNum: 2 },
        // { valueName: "交通补助", valueNum: 3 },
        // { valueName: "加班补助", valueNum: 4 },
        // { valueName: "有提成", valueNum: 5 },
        // { valueName: "奖金奖励", valueNum: 6 },
        // { valueName: "转正机会", valueNum: 7 }
      ],
      minimumPrice: "", //薪资范围最小
      highestPrice: "", //薪资范围最大

      housesList: [],
      housesTotal: 0,
      type1: [],
      type7: [], //区域
      settlementMethodList: [
        // { valueName: "日结", valueNum: 1 },
        // { valueName: "周结", valueNum: 2 },
        // { valueName: "月结", valueNum: 3 },
        // { valueName: "完工结算", valueNum: 4 },
        // { valueName: "其他结算", valueNum: 5 }
      ], //结算方式
      type09: [], //薪资范围

      type011: [], //岗位类型
      type012: [], //工作时段
      type013: [], // 用工日期
      type014: [
        { valueName: "短期兼职", valueNum: 1 },
        { valueName: "长期兼职", valueNum: 2 },
        { valueName: "周末兼职", valueNum: 3 },
      ], // 工作周期(可多选)
      type015: [
        { valueName: "包住宿", valueNum: 1 },
        { valueName: "包工作餐", valueNum: 2 },
        { valueName: "交通补助", valueNum: 3 },
        { valueName: "加班补助", valueNum: 4 },
        { valueName: "有提成", valueNum: 5 },
        { valueName: "奖金奖励", valueNum: 6 },
        { valueName: "转正机会", valueNum: 7 },
      ], // 福利(可多选)

      employmentDate: [],
      startTime: "",
      endTime: "",
      screenList: [],
    };
  },
  watch: {
    type: {
      handler(newV, oldV) {
        if (newV) {
          // this.getDictionaries();

          this.clear(-1);
        }
      },
      immediate: false,
    },
    "fullData.distance"(newV, oldV) {
      console.log("distance", newV);
      if (newV) {
        this.setScreen();
        // this.clear(-1);
      }
    },
    "fullData.releaseDate"(newV, oldV) {
      // console.log("releaseDate", newV);
      console.log("releaseDate", this.fullData.releaseDate);

      setTimeout(() => {
        console.log("releaseDate", this.fullData.releaseDate);
      }, 50);
      if (newV) {
        this.setScreen();
        // this.clear(-1);
      }
    },
    ageRange2(newV, oldV) {
      console.log("ageRange2ageRange2", newV);
      if (newV) {
        this.ageRangeList1.map((item) => {
          item.disabled = item.value > newV;
        });
        if (this.ageRange1) {
          this.fullData.dateBirth = this.ageRange1 + "," + newV;
          this.setScreen();
        }
      } else {
        this.ageRangeList1.map((item) => {
          item.disabled = false;
        });
        this.fullData.dateBirth = "";
      }
    },
    ageRange1(newV, oldV) {
      console.log("ageRange1ageRange1ageRange1", newV);

      if (newV) {
        this.ageRangeList2.map((item) => {
          item.disabled = item.value < newV;
        });
        if (this.ageRange2) {
          this.fullData.dateBirth = newV + "," + this.ageRange1;
          this.setScreen();
        }
      } else {
        this.ageRangeList2.map((item) => {
          item.disabled = false;
        });
        this.fullData.dateBirth = "";
      }
    },
  },
  computed: {
    // isXuan() {
    //   return isXuan(item, key, valueKey = "valueName")=>{
    //     console.log("isXuanisXuanisXuan", item);
    //     let comList = this[key + "List"];
    //     let comForm = this.type == "full" ? "fullData" : "partData";
    //     if (!this[comForm] || !this[comForm][key]) {
    //       return;
    //     }
    //     let comFormData = this[comForm][key];
    //     if (item == -1) {
    //       return !!comFormData;
    //     } else {
    //       let separator;
    //       separator = comFormData.indexOf(",") > -1 ? "," : false;
    //       separator = comFormData.indexOf("|") > -1 ? "|" : false;
    //       if (separator) {
    //         let arr = comFormData.split(separator);
    //         for (let i = 0; i < arr.length; i++) {
    //           if (arr[i] == item[valueKey]) {
    //             return true;
    //             break;
    //           }
    //         }
    //       } else {
    //         return comFormData == item[valueKey];
    //       }
    //     }
    //     return false;
    //   }
    // }
  },
  methods: {
    confirmnnnn() {
      let comForm = this.type == "full" ? "fullData" : "fullData";
      if (this.minimumPrice && this.highestPrice) {
        if (Number(this.minimumPrice) > Number(this.highestPrice)) {
          this.myErrorMessage("最低薪资不允许高于最高薪资");
          return;
        } else {
          this[comForm]["salaryExpectation"] =
            this.minimumPrice + "-" + this.highestPrice;
          this.xinzi = 1;
        }
      } else {
        this[comForm]["salaryExpectation"] = "";
        this.quyuIndex = -1;
        this.xinzi = -1;
      }
      this.setScreen();
    },
    employmentDateChange() { },
    getParam() {
      let comForm = this.type == "full" ? "fullData" : "fullData";
      this[comForm].positionCategory = this[comForm].industryType;

      // 一年以内

      var obj = JSON.parse(JSON.stringify(this[comForm]));
      if ("一年以内" == obj.workExperience) {
        obj.workExperience = "1年以内";
      }
      // 兼职
      if (this.type == "resume") {
        // 薪资范围
        // if (this.minimumPrice && this.highestPrice) {
        //   if (Number(this.minimumPrice) > Number(this.highestPrice)) {
        //     this.myErrorMessage("最低薪资不允许高于最高薪资");
        //   }
        // } else {
        //   this[comForm]["workingHours"] = "";
        // }

        this.$emit("getQueryData", obj);
        console.log("打印打印", obj);
      }
    },
    goClick(
      item,
      key,
      mode = "single",
      valueKey = "valueName",
      separator = ","
    ) {
      let comList = this[key + "List"];
      let comForm = this.type == "full" ? "fullData" : "fullData";
      if (!this[comForm]) {
        return;
      }
      let comFormData = this[comForm][key];
      console.log("111", this.type);
      if (mode == "single") {
        if (item == -1) {
          this[comForm][key] = "";
        } else {
          this[comForm][key] = item[valueKey];
        }
      }
      if (mode == "multile") {
        if (item == -1) {
          this[comForm][key] = "";
        } else {
          console.log("thisthis", comFormData);

          let arr = comFormData.split(separator).filter((item) => item);
          // console.log("thisthis", JSON.stringify(arr));

          let i = -1;
          i = arr.findIndex(function (item2) {
            return item2 == item[valueKey];
          });

          if (i == -1) {
            arr.push(item[valueKey]);
          } else {
            arr.splice(i, 1);
          }
          console.log("thisthis", arr);

          this[comForm][key] = arr.join(",");
          console.log("this[comForm]", JSON.stringify(this[comForm], null, 2));
        }
      }
      this.setScreen();
      console.log("点击点击点击", this[comForm][key]);
    },
    isXuan(item, key, valueKey = "valueName") {
      key = key.trim();
      let comList = this[key + "List"];
      let comForm = this.type == "full" ? "fullData" : "fullData";
      // console.log(
      //   "isXuanisXuanisXuan",
      //   item,
      //   JSON.stringify(this[comForm]),
      //   this[comForm][key],
      //   key
      // );

      if (!this[comForm]) {
        return;
      }

      let comFormData = this[comForm][key];
      if (item == -1) {
        return comFormData == "";
      } else {
        let separator;
        if (comFormData.indexOf(",") > -1) {
          separator = ",";
        }
        if (comFormData.indexOf("|") > -1) {
          separator = "|";
        }

        if (separator) {
          let arr = comFormData.split(separator).filter((item) => item);
          for (let i = 0; i < arr.length; i++) {
            if (arr[i] == item[valueKey]) {
              return true;
              break;
            }
          }
        } else {
          return comFormData == item[valueKey];
        }
      }
      return false;
    },
    clear(item) {
      let comForm = this.type == "full" ? "fullData" : "fullData";
      if (item == -1) {
        for (const key in this[comForm]) {
          this[comForm][key] = "";
        }
        this.ageRange1 = "";
        this.ageRange2 = "";
        this.minimumPrice = "";
        this.highestPrice = "";

        this.clear2(-1, true);
      } else {
        if (item.key == "industryType") {
          this.clear2(item, true);
        } else {
          let i = -1;
          let key = item.key;
          let value = item.value;
          let comFormData = this[comForm][key];
          if (comFormData.indexOf(",") > -1) {
            let arr = comFormData.split(",");

            i = arr.findIndex(function (item2) {
              return item.value == item2;
            });
            console.log(arr, i, item);
            if (i > -1) {
              arr.splice(i, 1);
            }
            this[comForm][key] = arr.join(",");
            // value
          } else {
            this[comForm][key] = "";
          }
        }
        if ("dateBirth" == item.key) {
          this.ageRange2 = "";
          this.ageRange1 = "";
        }
        if (item.key == "salaryExpectation") {
          this.minimumPrice = "";
          this.highestPrice = "";
        }
      }
      this.setScreen();
    },
    setScreen(flag = false) {
      setTimeout(() => {
        var arr = [];
        let comForm = this.type == "full" ? "fullData" : "fullData";
        for (const key in this[comForm]) {
          if (this[comForm].hasOwnProperty.call(this[comForm], key)) {
            const element = this[comForm][key];
            if (element && key == "positionCategory") {
            } else if (
              element &&
              key != "dateBirth" &&
              element.indexOf(",") > -1
            ) {
              arr.push(
                ...element.split(",").map((item) => {
                  return {
                    value: item,
                    key,
                    type: "multile",
                  };
                })
              );
            } else if (element) {
              if (key == "salaryExpectation") {
                arr.push({
                  value: element + "元",
                  key,
                  type: "single",
                });
              } else if (key == "dateBirth") {
                arr.push({
                  value:
                    element.split(",")[0] + "-" + element.split(",")[1] + "岁",
                  key,
                  type: "single",
                });
              } else if (key == "releaseDate") {
                arr.push({
                  value: element + "天内",
                  key,
                  type: "single",
                });
              } else {
                arr.push({
                  value: element,
                  key,
                  type: "single",
                });
              }
            }
          }
        }
        this.screenList = arr;

        !flag && this.getParam();
        console.log("this.screenListthis.screenList", this.screenList);
      });
    },

    industryTypeClick(item, ref) { },
    isXuan2(item) {
      let comForm = this.type == "full" ? "fullData2" : "fullData2";
      let activeFormObj = this[comForm]["industryTypeForm"];
      // console.log(
      //   "itemitem",
      //   item,
      //   activeFormObj[item.id] &&
      //     activeFormObj[item.id].length > 0 &&
      //     (activeFormObj[item.id] || []).findIndex(function(item2) {
      //       return item2.id == item.id;
      //     }) > -1
      // );
      if (item != -1) {
        return activeFormObj[item.id];
      }
    },
    isXuan3(item) {
      let comForm = this.type == "full" ? "fullData2" : "fullData2";
      let activeFormObj = this[comForm]["industryTypeForm"];
      if (item != -1) {
        return (
          activeFormObj[item.parentId] &&
          activeFormObj[item.parentId].length > 0 &&
          (activeFormObj[item.parentId] || []).findIndex(function (item2) {
            return item2.id == item.id;
          }) > -1
        );
      } else {
        console.log(
          "activeFormObj[this.parentId]",
          activeFormObj[this.parentId]
        );
        var defaultList = activeFormObj[this.parentId] || [];

        return defaultList.filter((item) => !item.children).length == 0;
      }
    },

    // 点击行业数据
    goClickn(item, level = 2, ref) {
      let comForm = this.type == "full" ? "fullData2" : "fullData2";
      let activeFormObj = this[comForm]["industryTypeForm"];
      if (level == 1) {
        let comForm = this.type == "full" ? "fullData" : "fullData";
        if (item != -1) {
          this.industryTypeIndex = item.lableName;
          this.curIndustryTypeList = JSON.parse(JSON.stringify(item.children));
          this.brandloading = true;
          console.dir(this.$refs[ref][0]);

          this.trangleLeft =
            this.$refs[ref][0].offsetLeft +
            this.$refs[ref][0].clientWidth / 2 +
            10;

          this.parentId = "";
          this.curIndustryTypeCList = [];
        } else {
          // 清空
          this[comForm]["industryType"] = "";
          activeFormObj = {};
          this.curIndustryTypeList = []; //当前下标数据
          this.industryTypeIndex = -1;
          this.brandloading = false;
          if (this.$refs[ref]) {
            this.trangleLeft = this.$refs[ref][0].clientWidth / 2 - 16;
          }
        }
      }
      if (level == 2) {
        console.log("leveleveleve", item);
        if (item == -1) {
          activeFormObj[this.parentId] = [];
        } else {
          let key = item.id;
          if (!activeFormObj[key]) {
            activeFormObj = Object.assign(
              JSON.parse(JSON.stringify(activeFormObj)),
              { [key]: [] }
            );
          }
          let activeArr = activeFormObj[key] || [];

          let index = -1;

          // index = activeArr.findIndex(item2 => item2.id == item.id);
          if (activeArr) {
            if (item.id == this.parentId) {
              this.parentId = "";
              delete activeFormObj[key];
              this.curIndustryTypeCList = [];
            } else {
              this.parentId = item.id;
              this.curIndustryTypeCList = (item.id && item.children) || [];
            }
          } else {
            this.parentId = item.id;
            // activeFormObj[key] = [];
            activeFormObj[key] = [];
            this.curIndustryTypeCList = (item.id && item.children) || [];
          }
          console.log("this.parentId = ", this.parentId);
        }
        // this.curIndustryTypeCList =
        //   activeFormObj[item.id] && activeFormObj[item.id].length > 1
        //     ? item.children
        //     : [];
      }
      if (level == 3) {
        if (item == -1) {
          activeFormObj[this.parentId] = [];
        } else {
          let key = item.parentId;
          if (!activeFormObj[key]) {
            activeFormObj = Object.assign(
              JSON.parse(JSON.stringify(activeFormObj)),
              { [key]: [] }
            );
          }
          let activeArr = activeFormObj[key] || [];
          if (activeArr.length == 1 && activeArr[0].children) {
            activeArr = [];
          }
          let index = -1;
          index = activeArr.findIndex((item2) => item2.id == item.id);
          if (index > -1) {
            activeFormObj[key].splice(index, 1);
          } else {
            // 最多只能3个
            let arr = [];
            for (const key1 in activeFormObj) {
              if (activeFormObj[key1]) {
                // .filter(item => !item.children)
                arr.push(...activeFormObj[key1]);
              }
            }
            if (arr.length >= 3) {
              this.myErrorMessage("只能选择3个职业分类");
              return;
            }
            activeFormObj[key].push(item);
          }
        }
      }
      // console.log(
      //   "activeFormObjactiveFormObjactiveFormObj",
      //   JSON.stringify(activeFormObj, null, 2)
      // );
      // console.log(
      //   "activeFormObjactiveFormObjactiveFormObj",
      //   activeFormObj,
      //   this[comForm]["industryTypeForm"]
      // );

      for (const key in activeFormObj) {
        if (
          activeFormObj[key].length == 0 &&
          (this.parentId != key || level == 1)
        ) {
          // .filter(item => !item.children)
          delete activeFormObj[key];
        }
      }
      this[comForm]["industryTypeForm"] = JSON.parse(
        JSON.stringify(activeFormObj)
      );
      this.setScreen2(activeFormObj);
    },
    // 获取行业数据
    setScreen2(object, flag) {
      var arr = [];
      for (const key in object) {
        if (object[key]) {
          // .filter(item => !item.children)
          arr.push(...object[key]);
        }
      }
      let comForm = this.type == "full" ? "fullData" : "fullData";
      this[comForm]["industryType"] = arr
        .map((item) => item.lableName)
        .join(",");
      !flag && this.setScreen();
    },
    // 行业分类特属
    clear2(item, flag) {
      let comForm = this.type == "full" ? "fullData2" : "fullData2";
      let activeFormObj = this[comForm]["industryTypeForm"];

      if (item == -1) {
        for (const key in activeFormObj) {
          activeFormObj[key] = [];
        }
      } else {
        let i = -1;
        // let parentId = -1;
        for (const key in activeFormObj) {
          if (activeFormObj.hasOwnProperty.call(activeFormObj, key)) {
            const elementArr = activeFormObj[key];
            i = elementArr.findIndex((item2) => item2.lableName == item.value);
            if (i > -1) {
              // parentId = activeFormObj[key].parentId;
              activeFormObj[key].splice(i, 1);

              break;
            }
          }
        }
      }
      for (const key in activeFormObj) {
        if (activeFormObj[key].length == 0 && this.parentId != key) {
          // .filter(item => !item.children)
          delete activeFormObj[key];
        }
      }
      console.log("activeFormObj", activeFormObj);

      this[comForm]["industryTypeForm"] = JSON.parse(
        JSON.stringify(activeFormObj)
      );

      this.setScreen2(activeFormObj, flag);
    },
    findArrIndex(arr, id) {
      return arr.findIndex((item) => item.id == id);
    },

    getDeepId(arr) {
      let parentId = "";
    },
    quyuClick1(item) {
      this.minimumPrice = "";
      this.highestPrice = "";
      this.fullData.salaryExpectation = "";
      this.setScreen();
    },
    quyuClick2() {
      this.ageRange1 = "";
      this.ageRange2 = "";
      this.fullData.dateBirth = "";
      this.setScreen();
    },
    quyuClick(item) {
      this.HousesPage.pageNo = 1;
      if (item != -1) {
        this.quyuIndex = item.valueNum;
        this.HousesPage.region = item.valueName;

        this.getHouseInfo();
        return;
      }
      this.quyuIndex = item;
      delete this.HousesPage.region;
      this.getHouseInfo();
    },
    priceClick(item) {
      this.HousesPage.pageNo = 1;
      if (item != -1) {
        this.priceIndex = item.valueNum;
        this.HousesPage.price = item.valueName;
        this.getHouseInfo();
        return;
      }
      this.priceIndex = item;
      delete this.HousesPage.price;
      this.getHouseInfo();
    },
    mianjiClick(item) {
      if (item == -1) {
        this.minimumPrice = "";
        this.highestPrice = "";
      }
      this.setScreen();
    },
    mianjiClick2(item) {
      if (item == -1) {
        this.startTime = "";
        this.endTime = "";
      }
      this.setScreen();
    },
    mianjiClick3(item) {
      if (item == -1) {
        this.employmentDate = [];
      }
      this.setScreen();
    },

    // loucClick(item) {
    //   this.HousesPage.pageNo = 1;
    //   if (item != -1) {
    //     this.loucIndex = item.valueNum;
    //     this.HousesPage.floor = item.remarks;

    //     this.getHouseInfo();
    //     return;
    //   }
    //   this.loucIndex = item;
    //   delete this.HousesPage.floor;
    //   this.getHouseInfo();
    // },
    //查询房源信息
    getHouseInfo() {
      // this.dealOPe(JSON.parse(JSON.stringify(this.HousesPage)));
      // this.$getHttp("/mob/home/getHouseInfo", this.HousesPage).then(data => {
      //   if (data.code == 200) {
      //     //二手房 房源较少时出现推荐房源
      //     this.recomstate = false;
      //     //查询是否加入对比
      //     this.housesList = data.list;
      //     this.housesTotal = data.count;
      //     console.log(this.housesList, "222");
      //   }
      // });
    },
    // 设置列表数据
    setList(key, value) {
      value = Array.isArray(value) ? value : [value];
      this[key + "List"] = [...this[key + "List"], ...value];
    },
  },
  created() {
    this.$getHttp("/api/mobile/personnelOwner/getWholeIndustryType", {
      recruitmentType: "1",
    }).then((res) => {
      if (res.code == 200) {
        res.industryTypeList.forEach((v) => {
          v.quantity = 0;
          v.children.forEach((s) => {
            s.children.forEach((j) => {
              j.active = false;
            });
          });
        });
        console.log(
          "res.industryTypeListres.industryTypeList",
          res.industryTypeList
        );
        this.setList("industryType", res.industryTypeList);
      }
    });

    this.$getHttp("/api/mobile/personnelOwner/queryDataDictionaryList", {
      type: "2,3,11",
    }).then((res) => {
      this.distanceList = [];
      this.highestEducationList = [];
      res.dataDictionaryList.forEach((el) => {
        el.active = false;
        if (el.type == 11) {
          this.distanceList.push({
            value: el.valueName,
            label: el.valueName,
          });
        } else if (el.type == 3) {
          this.highestEducationList.push(el);
        } else if (el.type == 2) {
          this.workExperienceList.push(el);
        }
      });
      for (var i = 5; i <= 30; i += 5) {
        this.releaseDateList.push({
          value: i + "",
          label: i + "",
        });
      }
      for (var i = 18; i <= 70; i += 1) {
        this.ageRangeList1.push({
          value: i,
          label: i,
          disabled: false,
        });
        this.ageRangeList2.push({
          value: i,
          label: i,
          disabled: false,
        });
      }
    });
  },
};
</script>

<style lang="less" scoped>
.saixuan {
  color: #333;
  width: 1200px;
  // margin-left: 50%;
  // transform: translateX(-50%);
  margin: 0 auto;
  font-size: 0;
  margin-top: 40px;
  padding-bottom: 20px;

  .li {
    .p1 {
      display: inline-block;
      font-size: 16px;
      font-weight: 600;
      margin-right: 24px;
      vertical-align: top;
      min-width: 72px;
    }

    .p2 {
      display: inline-block;
      font-size: 16px;
      margin-right: 32px;
      vertical-align: top;
      cursor: pointer;
    }

    div {
      display: inline-block;
      font-size: 16px;
      margin-right: 30px;
      vertical-align: top;
      margin-bottom: 10px;
    }

    .list {
      position: relative;
      width: 940px;

      /deep/ .el-date-editor--time-select:first-child {
        position: relative;

        &::after {
          content: "至";
          position: absolute;
          top: 50%;
          transform: translateY(-50%);
          right: -24px;
        }
      }

      .custom {
        display: flex;
        align-items: center;
        margin-bottom: 0;

        .custom_title {
          font-size: 16px;
          font-weight: 400;
          color: #333333;
          margin-right: 7px;
        }

        .custom_input_wrap {
          position: relative;
          margin-right: 0;
          margin-bottom: 0;

          &.custom_input_wrap_price::after {
            content: "元";
            position: absolute;
            top: 45%;
            transform: translateY(-50%);
            right: 6px;
          }
        }

        .custom_input {
          box-sizing: border-box;
          width: 96px;
          height: 32px;
          background-color: #ffffff;
          border-radius: 4px;
          border: 1px solid #d0d0d0;
          padding: 10px;
          padding-right: 24px;
        }

        .custom_qd {
          width: 78px;
          height: 32px;
          background-color: #64b6a8;
          border-radius: 4px;
          font-size: 16px;
          font-weight: 600;
          color: #ffffff;
          text-align: center;
          line-height: 32px;
          margin-left: 12px;
          margin-right: 12px;
          cursor: pointer;
        }

        .bq {
          width: 20px;
          height: 32px;
          color: #000;
          font-size: 16px;
          text-align: center;
          line-height: 20px;
          margin-right: 12px;
          margin-left: 8px;
          margin-bottom: 0;
        }
      }

      div {
        cursor: pointer;
      }
    }

    .xuan {
      color: #64b6a8;
    }
  }
}

.saixuan {
  color: #333;
  width: 1200px;
  // margin-left: 50%;
  // transform: translateX(-50%);
  margin: 0 auto;

  font-size: 0;
  margin-top: 40px;
  padding-bottom: 20px;

  .li {
    .p1 {
      display: inline-block;
      font-size: 16px;
      font-weight: 600;
      margin-right: 24px;
      vertical-align: top;
      min-width: 72px;
    }

    .p2 {
      display: inline-block;
      font-size: 16px;
      margin-right: 32px;
      vertical-align: top;
      cursor: pointer;
    }

    div {
      display: inline-block;
      font-size: 16px;
      margin-right: 30px;
      vertical-align: top;
      margin-bottom: 10px;
    }

    .list {
      width: 940px;

      /deep/ .el-date-editor--time-select:first-child {
        position: relative;

        &::after {
          content: "至";
          position: absolute;
          top: 50%;
          transform: translateY(-50%);
          right: -24px;
        }
      }

      div {
        cursor: pointer;
      }
    }

    .xuan {
      color: #64b6a8;
    }
  }
}

.yixuan {
  box-sizing: border-box;
  padding-top: 15px;
  padding-left: 16px;
  width: 1200px;
  min-height: 60px;
  background-color: #f7f7f7;
  margin-left: 50%;
  transform: translateX(-50%);
  font-size: 16px;

  .na {
    color: #333333;
    display: inline-block;
    vertical-align: middle;
    margin-right: 6px;
  }

  .li {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    padding: 4px 28px 4px 10px;
    color: #333333;
    color: #64b6a8;
    border: 1px solid #64b6a8;
    margin-right: 12px;

    img {
      position: absolute;
      width: 17px;
      height: 17px;
      top: 7px;
      right: 3px;
      cursor: pointer;
    }
  }

  .qinchu {
    display: inline-block;
    vertical-align: middle;
    width: 86px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    background-color: #999999;
    font-size: 16px;
    color: #ffffff;
    cursor: pointer;
  }

  .qinchu,
  .li,
  .na {
    margin-bottom: 12px;
  }
}

.brandPop2 {
  box-sizing: border-box;
  width: 920px;
  // height: 200px;
  border: 1px solid #64b6a8;
  position: relative;
  left: 142px;
  background-color: #fff;
  z-index: 998;
  display: flex;
  flex-wrap: wrap;
  // overflow: auto;
  // padding-left: 20px;
  padding: 6px 0 6px 12px;
  margin-bottom: 12px;

  .brandPop_item2 {
    display: flex;
    align-items: center;
    color: #333333;
    min-height: 32px;
    margin-right: 24px;
    margin-bottom: 6px;
    cursor: pointer;

    &.xuan {
      color: #64b6a8;
    }

    .brandPop_item_img2 {
      width: 32px;
      height: auto;
    }

    .brandPop_item_span2 {
      margin-left: 6px;
      font-size: 14px;
      font-weight: 400;
    }
  }
}
</style>
